<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                    <i class="el-icon-lx-cascades"></i> 应聘者管理
                </el-breadcrumb-item>    
                <el-breadcrumb-item>应聘者信息中心</el-breadcrumb-item>
            </el-breadcrumb>
        </div>

        <div class="container">
            <div class="handle-box">
                <!-- <el-button
                    type="primary"
                    icon="el-icon-plus"
                    class="handle-plus mr10"
                    @click="handleAdd"
                >添加文章</el-button> -->
                <el-input v-model="query.canId" placeholder="用户ID" class="handle-input mr10"></el-input>
                <!-- <el-popover
                placement="center"
                width="400"
                @click="open1"
                trigger="click">
                    <el-table :data="obj">
                        <el-table-column width="100" property="canId" label="用户名"></el-table-column>
                        <el-table-column width="100" property="canName" label="姓名"></el-table-column>
                        <el-table-column width="100" property="canGrade" label="评分"></el-table-column>
                        <el-table-column width="100" property="canExperience" label="工作经验"></el-table-column>
                    </el-table>
                    <el-button type="primary" slot="reference" icon="el-icon-search" >搜索</el-button>
                </el-popover> -->
                 <el-button type="primary" @click="handleSearch" icon="el-icon-search" >搜索</el-button>
                <el-input v-model="query.canPower" placeholder="技术栈" class="handle-input mr10"></el-input>
                <el-button type="primary" icon="el-icon-search" @click="handleSearch2">搜索</el-button>  
                <el-button type="primary" icon="el-icon-refresh" @click="refreshData">重置</el-button>

            </div>
            <el-table
                :data="blogArticles"
                border
                class="table"
                header-cell-class-name="table-header"
            >
                <el-table-column prop="canId" label="ID" width="55" align="center"></el-table-column>
                <el-table-column prop="canName" label="用户名"></el-table-column>
                <el-table-column prop="canAge" label="年龄"></el-table-column>
                <el-table-column prop="canExperience" label="工作经验">
                </el-table-column>
                <!-- <el-table-column label="状态" align="center">
                    <template slot-scope="scope">
                        <el-tag
                            :type="scope.row.blog_status===0?'success':(scope.row.blog_status===1?'danger':'')"
                        >{{scope.row.blog_status==0?'发布成功':'等待审核'}}</el-tag>
                    </template>
                </el-table-column> -->
                <el-table-column prop="canWantPosition" label="期望职位" ></el-table-column>
                <!-- <el-table-column prop="create_time" label="发布时间" width="160"></el-table-column>
                <el-table-column prop="update_time" align="center" label="更新时间" width="160"></el-table-column> -->
                <el-table-column label="操作" width="180" align="center">
                    <template slot-scope="scope">
                        <!-- <el-button
                            type="text"
                            @click="gotoEdit(scope.$index,scope.row.canId)"
                        >登分</el-button> -->
                        <el-button
                            type="text"
                            @click="handleJianLi(scope.$index, scope.row.canId)"
                        >简历</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination">
                <el-pagination
                    @current-change="getData"
                    :current-page="currentPage"
                    :page-count="total"
                    layout="prev, pager, next"
                    background
                    hide-on-single-page
                ></el-pagination>
            </div>
            <el-dialog title="查询结果"  :visible.sync="dialogTableVisible">
                <el-form :model="obj">
                    <el-form-item label="ID" >
                    <el-input v-model="obj.canId" readonly class="handle-input mr10"></el-input>
                    </el-form-item>
                    <el-form-item label="用户名" >
                    <el-input v-model="obj.canName" readonly class="handle-input mr10"></el-input>
                    </el-form-item>
                    <el-form-item label="工作经验" >
                    <el-input v-model="obj.canExperience" readonly class="handle-input mr10"></el-input>
                    </el-form-item>
                    <el-form-item label="技术栈" >
                    <el-input v-model="obj.canPower" readonly class="handle-input mr10"></el-input>
                    </el-form-item>
                    <el-form-item label="评分" >
                    <el-input v-model="obj.canGrade" readonly class="handle-input mr10"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="dialogTableVisible = false">返回</el-button>
                    <el-button type="primary" @click="dialogTableVisible = false">查看简历</el-button>
                </div>
            </el-dialog>

        </div>
        
    </div>
</template>

<script>
export default {
    name: 'articles',
    inject: ['reload'],
    data() {
        return {
            query: {
                canId: '',
                canPower:''
            },
            currentPage: 1,
            blogArticles: [],
            total: 0,
            obj:{
                canId:-1
            },
            dialogTableVisible:false
        };
    },
    mounted() {
        this.getData(1);
    },
    methods: {
        getData(currentPage) {
            const _this = this;
            _this.getBlogData(currentPage);
        },
        getBlogData(currentPage) {
            const _this = this;
            this.$axios
                .get('/Candidate/getAllCandidates', {
                    params: {
                        currentPage: currentPage
                    },
                    headers: {
                        Authorization: localStorage.getItem('token')
                    }
                })
                .then(res => {
                    _this.blogArticles = res.data.data.data;
                    _this.currentPage = res.data.data.currentPage;
                    _this.total = res.data.data.totalPage;
                });
        },
        // 触发搜索按钮
        handleSearch() {
            const _this = this;
            const canId = _this.query.canId;
            this.$axios
                .get('/Candidate/getCandidate/' + canId, {
                })
                .then(res => {
                    console.log(res)
                    if (res.data.code == 200||res.data.code == 201) {
                        _this.obj = res.data.data;
                        _this.dialogTableVisible = true;
<<<<<<< HEAD
=======
                        _this.query = {};
>>>>>>> a6928a3 (+)
                    } else {
                        this.$message.error("查找失败");
                    }
                })
                .catch(err => {
                    this.$message.error("查找失败");
                });
            
        },
        // 触发搜索按钮2
        handleSearch2() {
            const _this = this;
            const canPower = _this.query.canPower;
            this.$axios
                .get('/Candidate/getCandidatesByPower/' + canPower, {
                })
                .then(res => {
                    console.log(res)
                    if (res.data.data.code == 200||res.data.data.code == 201) {
                        _this.blogArticles = res.data.data.data;
                        _this.currentPage = res.data.data.currentPage;
                        _this.total = res.data.data.totalPage;
<<<<<<< HEAD
                    } else {
                        this.$message.error("查找失败");
=======
                        _this.query = {};
                    } else {
                        this.$message.error("查找失败");
                        _this.query = {};
>>>>>>> a6928a3 (+)
                    }
                })
                .catch(err => {
                    this.$message.error("查找失败");
                });
        },
        // 简历
        handleJianLi(index, canId) {
            this.$router.push({
                path: '/JianLi',
                query: {
                    blog_id: canId
                }
            });
        },
        gotoEdit(index, canId) {
            this.$router.push({
                path: '/addgradec',
                query: {
                    blog_id: canId
                }
            });
        },
        //置顶操作
        changeSwitch(data) {
           // console.log(data);
        },
        //添加操作
        handleAdd() {
            this.$router.push('/BlogEdit');
        },
        refreshData() {
            this.getData(1);
        },
        // open1() {
            

        //     // const h = this.$createElement;
        //     // this.$msgbox({
        //     // title: '简介',
        //     // message: h('p', null, [
        //     //     h('span', null, 'ID:'),
        //     //     h('span', null, this.obj.canId),
        //     //     h('i', { style: 'color: teal' }, 'VNode')
        //     // ]),
        //     // showCancelButton: true,
        //     // confirmButtonText: '确定',
        //     // cancelButtonText: '取消',
        //     // beforeClose: (action, instance, done) => {
        //     //     if (action === 'confirm') {
        //     //     instance.confirmButtonLoading = true;
        //     //     instance.confirmButtonText = '执行中...';
        //     //     setTimeout(() => {
        //     //         done();
        //     //         setTimeout(() => {
        //     //         instance.confirmButtonLoading = false;
        //     //         }, 300);
        //     //     }, 3000);
        //     //     } else {
        //     //     done();
        //     //     }
        //     // }
        //     // }).then(action => {
        //     // this.$message({
        //     //     type: 'info',
        //     //     message: 'action: ' + action
        //     // });
        //     // });
        // },
        changeStatus(index, row) {
            const _this = this;
            const blog_id = row.blog_id;
            const is_top = row.is_top;
            const params = {
                blog_id,
                is_top
            };
            this.$axios
                .put('/admin/blog/isTop', params, {
                    headers: {
                        Authorization: localStorage.getItem('token')
                    }
                })
                .then(res => {
                    if (res.data.code == 200) {
                        this.$message.success(res.data.msg);
                        this.reload();
                    } else {
                        this.$message.error(res.data.msg);
                    }
                })
                .catch(err => {
                    this.$message.error('不要再试了哦，没有权限');
                });
        }
    }
};
</script>

<style scoped>
.handle-box {
    margin-bottom: 20px;
}
.handle-select {
    width: 120px;
}
.handle-input {
    width: 300px;
    display: inline-block;
}
.table {
    width: 100%;
    font-size: 14px;
}
.red {
    color: #ff0000;
}
.mr10 {
    margin-right: 10px;
}
.table-td-thumb {
    display: block;
    margin: auto;
    width: 40px;
    height: 40px;
}
/*上传图片*/
.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.avatar-uploader .el-upload:hover {
    border-color: #409eff;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}
.avatar {
    width: 178px;
    height: 178px;
    display: block;
}
</style>